<template>
  <div class="ai-recipes-container">
    <h2>AI智能菜谱助手</h2>
    <p class="description">与AI助手对话，获取您想要的菜谱信息和图片</p>
    <AIChat />
  </div>
</template>

<script setup lang="ts">
import AIChat from '@/components/AIChat.vue'
</script>

<style scoped>
.ai-recipes-container {
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

h2 {
  text-align: center;
  color: #333;
  margin-bottom: 10px;
}

.description {
  text-align: center;
  color: #666;
  margin-bottom: 30px;
}
</style>